هياكل البيانات: الكائنات والمصفوفات في جافاسكريبت

تُعتبر هياكل البيانات من الركائز الأساسية لأي لغة برمجة، حيث تمثل الطريقة التي يتم بها تنظيم وتخزين البيانات داخل البرامج لكي يتم التعامل معها بكفاءة ومرونة. وفي لغة جافاسكريبت، التي تُستخدم على نطاق واسع في تطوير الويب، تُعد الكائنات (Objects) والمصفوفات (Arrays) من أكثر هياكل البيانات استخداماً وأهمية، لما توفرانه من طرق فعالة لتمثيل وتنظيم المعلومات المختلفة.

في هذا المقال، سنتناول بالتفصيل ماهية الكائنات والمصفوفات في جافاسكريبت، كيف يتم إنشاؤها والتعامل معها، أهم الخصائص والوظائف التي توفرها، بالإضافة إلى مقارنة بينهما وكيفية اختيار الأنسب حسب طبيعة الاستخدام. كما سنقدم بعض الأمثلة العملية التي توضح كيفية استخدام هياكل البيانات هذه في تطبيقات حقيقية، مع التركيز على التفاصيل التي تجعلها أساسية لفهم البرمجة بلغة جافاسكريبت.

مقدمة عن هياكل البيانات في جافاسكريبت

قبل الخوض في تفاصيل الكائنات والمصفوفات، من المهم فهم مفهوم هياكل البيانات بشكل عام. هياكل البيانات هي الوسيلة التي يتم بها تنظيم البيانات وتخزينها للوصول إليها بفعالية. كل هيكل بيانات له خصائصه التي تجعله مناسباً لنوع معين من البيانات والعمليات.

في جافاسكريبت، تختلف طبيعة البيانات بين بسيطة مثل الأعداد والنصوص، ومعقدة مثل الكائنات والمصفوفات. الكائنات والمصفوفات تتيحان التعامل مع بيانات مركبة مثل مجموعات العناصر أو البيانات المرتبطة.

الكائنات في جافاسكريبت

ما هو الكائن (Object)؟

الكائن في جافاسكريبت هو بنية بيانات تُستخدم لتمثيل شيء يحتوي على خصائص (Properties) وقيم، حيث يتم تمثيل كل خاصية بواسطة مفتاح (Key) وقيمة (Value). هذا يسمح بتمثيل البيانات بشكل منظم يمكن الوصول إليه بسهولة.

الكائنات في جافاسكريبت تُعتبر مجموعات غير مرتبة من الأزواج المفتاحية والقيمية. المفتاح يكون عادة سلسلة نصية (String) أو رمز (Symbol)، والقيمة يمكن أن تكون أي نوع من البيانات، بما في ذلك كائنات أخرى أو دوال.

إنشاء الكائنات

يمكن إنشاء الكائنات بعدة طرق في جافاسكريبت، من بينها:

1. باستخدام الأقواس المعقوفة {}:

javascript
CopyEdit
const person = {
  name: "علي",
  age: 30,
  profession: "مهندس"
};

2. باستخدام دالة المنشئ (Constructor):

javascript
CopyEdit
const person = new Object();
person.name = "علي";
person.age = 30;
person.profession = "مهندس";

3. باستخدام Object.create() لإنشاء كائن يرث من كائن آخر:

javascript
CopyEdit
const proto = {
  greet() {
    console.log("مرحباً!");
  }
};

const person = Object.create(proto);
person.name = "علي";
person.greet(); // ترحب

الوصول إلى خصائص الكائن

يمكن الوصول إلى خصائص الكائن بطريقتين رئيسيتين:

• النقطة (Dot notation):

javascript
CopyEdit
console.log(person.name);  // "علي"

• الأقواس (Bracket notation):

javascript
CopyEdit
console.log(person["age"]);  // 30

الأقواس مفيدة بشكل خاص عندما يكون اسم الخاصية متغيراً أو يحتوي على فراغات أو رموز غير صالحة لاستخدام النقطة.

إضافة وتعديل وحذف الخصائص

• إضافة خاصية جديدة:

javascript
CopyEdit
person.city = "الرياض";

• تعديل خاصية:

javascript
CopyEdit
person.age = 31;

• حذف خاصية:

javascript
CopyEdit
delete person.profession;

خصائص الكائن الديناميكية

يمكن استخدام الحوسبة الديناميكية لمفاتيح الخصائص:

javascript
CopyEdit
const key = "email";
person[key] = "[email protected]";

طرق الكائن (Methods)

يمكن للكائنات أن تحتوي على دوال تُسمى “طرق” وهي وظائف مرتبطة بالكائن:

javascript
CopyEdit
const person = {
  name: "علي",
  greet() {
    console.log(`مرحباً، اسمي ${this.name}`);
  }
};

person.greet();  // "مرحباً، اسمي علي"

استخدام this يشير إلى الكائن نفسه داخل الطريقة.

أهمية الكائنات في جافاسكريبت

تستخدم الكائنات بشكل واسع في جافاسكريبت لتمثيل البيانات المنظمة، إنشاء الموديلات (Models) في البرمجة الكائنية، تخزين إعدادات البرامج، التعامل مع البيانات في واجهات برمجة التطبيقات (APIs)، وغير ذلك.

المصفوفات في جافاسكريبت

ما هي المصفوفة (Array)؟

المصفوفة هي نوع خاص من الكائنات يستخدم لتمثيل مجموعة مرتبة من القيم، حيث يتم تخزين البيانات في قائمة منظمة يمكن الوصول إلى كل عنصر فيها عن طريق فهرس رقمي يبدأ من الصفر.

المصفوفات في جافاسكريبت يمكن أن تحتوي على أنواع بيانات متعددة في نفس المصفوفة، بما في ذلك الأعداد، النصوص، الكائنات، حتى مصفوفات أخرى (المصفوفات متعددة الأبعاد).

إنشاء المصفوفات

يمكن إنشاء المصفوفات بطرق مختلفة، منها:

1. باستخدام الأقواس المربعة []:

javascript
CopyEdit
const numbers = [10, 20, 30, 40];

2. باستخدام دالة المنشئ Array():

javascript
CopyEdit
const fruits = new Array("تفاح", "موز", "برتقال");

الوصول إلى عناصر المصفوفة

يتم الوصول إلى عناصر المصفوفة بواسطة الفهرس (index):

javascript
CopyEdit
console.log(numbers[0]);  // 10
console.log(fruits[2]);   // "برتقال"

تعديل وإضافة وحذف العناصر

• تعديل عنصر:

javascript
CopyEdit
numbers[1] = 25;  // 20 تصبح 25

• إضافة عنصر في نهاية المصفوفة:

javascript
CopyEdit
fruits.push("عنب");

• حذف آخر عنصر:

javascript
CopyEdit
fruits.pop();

• إضافة عنصر في بداية المصفوفة:

javascript
CopyEdit
fruits.unshift("مانجو");

• حذف أول عنصر:

javascript
CopyEdit
fruits.shift();

خصائص المصفوفة الأساسية

• خاصية length تعطي عدد العناصر في المصفوفة:

javascript
CopyEdit
console.log(numbers.length);  // 4

• يمكن الوصول إلى آخر عنصر باستخدام:

javascript
CopyEdit
console.log(numbers[numbers.length - 1]);

استخدام المصفوفات المتداخلة

يمكن أن تحتوي المصفوفة على مصفوفات أخرى:

javascript
CopyEdit
const matrix = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];
console.log(matrix[1][2]);  // 6

الوظائف والطرق الشائعة للمصفوفات

جافاسكريبت تزخر بعدد كبير من الدوال المدمجة التي تسهل التعامل مع المصفوفات مثل:

• forEach() لتنفيذ دالة على كل عنصر.

• map() لإنشاء مصفوفة جديدة بعد تعديل كل عنصر.

• filter() لاختيار العناصر التي تحقق شرطاً معيناً.

• reduce() لتجميع العناصر إلى قيمة واحدة.

• find() لإيجاد أول عنصر يحقق شرطاً معيناً.

مثال:

javascript
CopyEdit
const nums = [1, 2, 3, 4, 5];
const doubled = nums.map(n => n * 2);  // [2, 4, 6, 8, 10]
const evens = nums.filter(n => n % 2 === 0);  // [2, 4]

مقارنة بين الكائنات والمصفوفات

اختيار الهيكل المناسب

اختيار الكائن أو المصفوفة يعتمد على طبيعة البيانات والعمليات التي سيتم تنفيذها:

• إذا كانت البيانات عبارة عن مجموعة من الخصائص المرتبطة بأسماء فريدة، فيفضل استخدام الكائنات.

• إذا كانت البيانات تمثل مجموعة من العناصر المرتبة التي يحتاج المبرمج للتعامل معها بترتيب معين، يفضل استخدام المصفوفات.

• في بعض الحالات، يمكن دمج الكائنات والمصفوفات معاً لإنشاء هياكل بيانات أكثر تعقيداً، مثل مصفوفة من الكائنات أو كائن يحتوي على مصفوفات.

الاستخدامات العملية في البرمجة

تخزين بيانات المستخدم

عند تخزين بيانات مستخدم في تطبيق جافاسكريبت، عادةً ما يتم استخدام كائن:

javascript
CopyEdit
const user = {
  id: 123,
  username: "ali123",
  email: "[email protected]",
  roles: ["admin", "editor"]
};

في المثال أعلاه، roles هي مصفوفة داخل كائن، تمثل قائمة الأدوار.

التعامل مع قوائم العناصر

عند التعامل مع قائمة من العناصر، مثل قائمة مهام، نستخدم المصفوفة:

javascript
CopyEdit
const tasks = [
  { id: 1, title: "شراء مستلزمات", completed: false },
  { id: 2, title: "كتابة تقرير", completed: true },
  { id: 3, title: "مراجعة البريد", completed: false }
];

يمكن التعامل مع هذه المصفوفة باستخدام دوال مثل filter و map لتنظيم وعرض المهام.

ديناميكية التعديل

الكائنات والمصفوفات في جافاسكريبت ديناميكية بطبيعتها، يمكن إضافة أو حذف خصائص وعناصر أثناء تشغيل البرنامج بسهولة، مما يجعل جافاسكريبت مرنة وقوية للتعامل مع البيانات المتغيرة.

الأداء والاعتبارات التقنية

الأداء في الوصول إلى البيانات

الوصول إلى خصائص الكائنات عبر المفتاح سريع جداً لأنه يعتمد على عمليات التجزئة (Hashing). بينما الوصول لعناصر المصفوفة حسب الفهرس أيضاً سريع للغاية.

الذاكرة والتخزين

المصفوفات في جافاسكريبت ليست بالضرورة متجاورة في الذاكرة كما هو الحال في لغات أخرى، لكنها مُحسنة للتعامل مع القوائم المتغيرة بفعالية.

الاستخدام في مكتبات وأُطر العمل

جميع المكتبات وأطر العمل الحديثة مثل React، Angular، وVue تعتمد بشكل كبير على الكائنات والمصفوفات لتنظيم البيانات، تخزين الحالة، ونقل المعلومات بين المكونات.

مثال تطبيقي متكامل

لنفترض أننا نبني تطبيق ويب لإدارة الموظفين، ونريد تخزين بيانات الموظفين وتنظيمها.

javascript
CopyEdit
const employees = [
  {
    id: 1,
    name: "سارة",
    position: "مدير مشروع",
    contact: {
      email: "[email protected]",
      phone: "0501234567"
    }
  },
  {
    id: 2,
    name: "محمد",
    position: "مبرمج",
    contact: {
      email: "[email protected]",
      phone: "0509876543"
    }
  }
];

// إضافة موظف جديد
employees.push({
  id: 3,
  name: "ليلى",
  position: "مصممة جرافيك",
  contact: {
    email: "[email protected]",
    phone: "0505555555"
  }
});

// عرض جميع أسماء الموظفين
employees.forEach(employee => {
  console.log(employee.name);
});

في هذا المثال، تم استخدام مصفوفة لتخزين قائمة الموظفين، وكل موظف هو كائن يحتوي على خصائصه الخاصة، بما في ذلك كائن فرعي contact لتفاصيل الاتصال.

خاتمة

الكائنات والمصفوفات في جافاسكريبت تشكلان العمود الفقري لتنظيم البيانات داخل التطبيقات البرمجية. الكائنات تسمح بتمثيل البيانات بشكل هيكلي باستخدام أزواج مفتاح-قيمة، مما يجعلها مناسبة لتمثيل الكيانات المعقدة، في حين تتيح المصفوفات تنظيم مجموعات البيانات المرتبة والتعامل معها بطرق مرنة ومتنوعة.

فهم هذه الهياكل جيداً يعزز قدرة المبرمج على بناء برامج أكثر تنظيماً وكفاءة، مع تسهيل عمليات البحث، التعديل، والمعالجة. كما أن الجمع بين الكائنات والمصفوفات في هياكل بيانات متداخلة يُمكّن المطورين من تمثيل معلومات معقدة ومتغيرة بسهولة، مما يعكس حقيقة تطبيقات الويب الحديثة التي تتطلب مرونة وكفاءة في إدارة البيانات.

المصادر والمراجع

• Mozilla Developer Network (MDN) – Object – https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object

• Mozilla Developer Network (MDN) – Array – https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array